import { Message, MessageBox, Form } from 'element-ui' 
import Vue from 'vue'
class UiMessage {
    constructor() {
        this.basePageUrl = '/user/member/task/mytask' // 弹窗回调跳转页地址
        this.commonCof = {
            closeOnClickModal: false, // 禁止遮罩关闭弹框
            showClose: false
        }
    } 
    fade(txt){
        return this.Message({
            ...this.commonCof,
            showClose: true,
            message: txt,
            type: 'warning'
        })
    }
    /**
     * 
     * @param {*} text 提示文案
     * @param {*} url 回调跳转地址
     * @param {*} callback 跳转页面接受的参数
     */
    successGoBase(text, url = this.basePageUrl, callback) {
        this.MessageBox.alert(text, '操作提示', {
            ...this.commonCof,
            confirmButtonText: '确定',
            showCancelButton: false, // 不展示取消按钮
            closeOnClickModal: false, // 禁止遮罩关闭弹框
            showClose: false,
            type: 'wraning',
            callback: action => {
                if (callback != "" && callback != null && callback != undefined){
                    location.href = url +'?'+ callback;
                }else{
                    location.href = url
                }
            }
        })
    }
    /**
     * 确定取消处理函数 通过.then .catch 执行
     * return 出去的是一个promise对象
     */
    confirm(text) {
        return this.MessageBox.confirm(text, '操作提示', {
            ...this.commonCof,
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning', // 可配置 看后续需求 warning 警示 success成功 error失败
        })
    }
    /**
     * 两按钮文字 和 标题 可配置
     * preproccess 不知道干哈的 从原项目复原过来
     */
    customDialogs(dTitle, dHtml, yTxt, cTxt, preproccess){
        preproccess && preproccess()
        return this.MessageBox.confirm(dHtml, dTitle, {
            ...this.commonCof,
            confirmButtonText: yTxt,
            cancelButtonText: cTxt,
            dangerouslyUseHTMLString: true, // 把文本当成html片段处理
            type: 'warning', // 可配置 看后续需求 warning 警示 success成功 error失败
        })
    }
    dialogs(dTitle, dHtml, yTxt, cTxt){
        return this.MessageBox.confirm(dHtml, dTitle, {
            ...this.commonCof,
            confirmButtonText: yTxt,
            cancelButtonText: cTxt,
            dangerouslyUseHTMLString: true, // 把文本当成html片段处理
            type: 'warning', // 可配置 看后续需求 warning 警示 success成功 error失败
        })
    }
    error(txt){
        return this.MessageBox.confirm(txt, '错误提示', {
            ...this.commonCof,
            showCancelButton : false,
            dangerouslyUseHTMLString: true, // 把文本当成html片段处理
            type: 'error', // 可配置 看后续需求 warning 警示 success成功 error失败
        })
    }
    message(msg, title){
        title ? title : '操作提醒'
        return this.MessageBox.confirm(msg, title, {
            ...this.commonCof,
            showConfirmButton : false,
            showCancelButton : false,
            dangerouslyUseHTMLString: true, // 把文本当成html片段处理
            type: 'warning', // 可配置 看后续需求 warning 警示 success成功 error失败
        })   
    }
    /**
     * 
     * @param {提示title} t 
     * @param {提示内容} h 
     * @param {校验函数} inputValidator 
     * @param {确定文案} yTxt 
     * @param {取消文案} nTxt 
     * @param {额外参数配置} options 
     */
    check_confirm(t='操作', h = '', inputValidator = (val) => {
        if (!val || val.length > 100 || val.length < 4){ 
            return '请输入规定范围文字个数4~100';
        }
    }, yTxt = '确定', nTxt = '取消', options) {
        let cOption = {
            ...this.commonCof,
            confirmButtonText: yTxt,
            cancelButtonText: nTxt,
            inputType: 'textarea',
            dangerouslyUseHTMLString: true, // 把文本当成html片段处理
            closeOnPressEscape: false, // 不可通过esc键关闭弹窗
            closeOnClickModal: false, // 不可通过遮罩层关闭
            type: 'warning', // 可配置 看后续需求 warning 警示 success成功 error失败
            inputValidator: inputValidator
        }
        // 合并参数
        if(options){
            cOption = {...cOption, ...options}
        }
        return new Promise((resolve, reject)=>{
            this.MessageBox.prompt(h, t, cOption).then(val => {
                resolve(val)
            }).catch(action=>{
                reject(action)
            })
        })
    }
    custom_comfirm(){
        var returnData = {
            isQualified : 0, // 质检合格0 不合格1 
            evaluate : ''   // 质检评价
        }
        let dHtml = `
        <div class="el-form-item is-success is-required">
            <label for="resource" class="el-form-item__label" style="width: 90px;">质检结果</label>
            <div class="el-form-item__content" style="margin-left: 100px;">
                <div role="radiogroup" class="el-radio-group">
                    <label role="radio" class="el-radio">
                        <span class="el-radio__input is-checked" id="sbt-radio0" isQualified = '0'>
                            <span class="el-radio__inner" isQualified = '0'></span>
                            <input type="radio" aria-hidden="true"  class="el-radio__original" value="合格" isQualified = '0'>
                        </span>
                        <span class="el-radio__label" isQualified = '0'>合格</span>
                    </label> 
                    <label role="radio" class="el-radio sbt-radio">
                        <span class="el-radio__input"  id="sbt-radio1" isQualified = '1'>
                            <span class="el-radio__inner" isQualified = '1'></span>
                            <input type="radio" aria-hidden="true"  class="el-radio__original" value="不合格" isQualified = '1'>
                        </span>
                        <span class="el-radio__label" isQualified = '1'>不合格</span>
                    </label>
                </div>
            </div>
        </div>
        <div class="el-form-item is-required"><label for="desc" class="el-form-item__label" style="width: 90px;">质检评价</label><div class="el-form-item__content" style="margin-left: 100px;"><div class="el-textarea"><textarea autocomplete="off" class="el-textarea__inner" style="min-height: 33px;" id="ui_textarea"></textarea><!----></div><!----></div></div>
        `
        let handerFn = e =>{
            const ev = e || window.event;
            const oLabel = ev.srcElement || ev.target;
            const qualified = oLabel.getAttribute('isQualified')
            if(qualified) {
                returnData.isQualified = qualified * 1
                if(qualified === '0'){
                    document.getElementById('sbt-radio0').className += ' is-checked';
                    document.getElementById('sbt-radio1').className = document.getElementById('sbt-radio1').className.replace(/is-checked/g, '')
                } else {
                    document.getElementById('sbt-radio1').className += ' is-checked';
                    document.getElementById('sbt-radio0').className = document.getElementById('sbt-radio0').className.replace(/is-checked/g, '')
                }
            }
        }
        document.body.addEventListener('click', handerFn)
        return new Promise((resolve, reject) => {
            this.MessageBox.confirm(dHtml, 'dTitle', {
                confirmButtonText: '提交',
                cancelButtonText: '取消',
                dangerouslyUseHTMLString: true, // 把文本当成html片段处理
                type: '', // 可配置 看后续需求 warning 警示 success成功 error失败
                beforeClose: (action, instance, done) => {
                    let uiTextarea = document.getElementById('ui_textarea');
                    returnData.evaluate = uiTextarea.value
                    if (action === 'confirm') {
                        if(uiTextarea.value.length > 100 || uiTextarea.value.length < 4){
                            Message.error('请输入规定范围文字个数4~100')
                            return;
                        }
                        done(returnData);
                    } else {
                        done();
                    }
                    }
            }).then(() => {
                document.body.removeEventListener('click', handerFn)
                resolve(returnData)
            }).catch( action => {
                document.body.removeEventListener('click', handerFn)
                reject(action)
            })
        })
    }
    
}
UiMessage.prototype.Message = Message
UiMessage.prototype.MessageBox = MessageBox

export default new UiMessage()